<template>
  <div style="width: 50%; margin: 30px auto">
    <div style="color: #666666; font-size: 16px">如果您有报修需求，欢迎提交给我们</div>
    <div style="margin-top: 20px">
      <el-input type="textarea" :rows="4" v-model="content" placeholder="请输入您的报修需求，包括联系方式，麻烦详细填写"></el-input>
    </div>
    <div style="margin-top: 20px; text-align: right">
      <el-button type="primary" @click="commit">提交</el-button>
    </div>
    <div style="font-size: 16px;margin-top: 30px;font-weight: bold;color: #666666">
      历史报修问题处理明细: {{tableData.length}}
    </div>
    <div style="margin-top: 20px">
      <el-table :data="tableData" stripe >
        <el-table-column prop="content" label="报修内容" show-overflow-tooltip></el-table-column>
        <el-table-column prop="time" label="提交时间" width="150px" show-overflow-tooltip></el-table-column>
        <el-table-column prop="name" label="业主姓名" width="100px"></el-table-column>
        <el-table-column prop="status" label="处理状态" width="100px">
          <template v-slot="scope">
            <el-tag type="success" v-if="scope.row.status==='已处理'">已处理</el-tag>
            <el-tag type="danger" v-else>待处理</el-tag>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
export default {

  data() {
    return {
      user: JSON.parse(localStorage.getItem('xm-user') || '{}'),
      content: null,
      tableData:[]
    }
  },
  created() {
    this.load()
  },
  methods: {
    load(){
      this.$request.get('/fixed/selectAll').then(res =>{
        if (res.code === '200'){
          this.tableData = res.data
        }else{
          this.$message.error(res.msg)
        }
      })
    },
    commit(){
      let data = {
        content: this.content
      }
      this.$request.post('/fixed/add',data).then(res =>{
        if (res.code === '200'){
          this.$message.success("提交成功，我们会尽快处理")
          this.content = null
          this.load()
        }else {
          this.$message.error(res.msg)
        }
      })
    }
  }
}
</script>

<style scoped>

</style>
